{{#accordion-list showExpandAll=false as |al expandFn|}}
  <div class="over-hr">
    <span>
      {{driverOptionsTitle}}
    </span>
  </div>
  {{#accordion-list-item
    title=(t "nodeDriver.amazonec2.access.title")
    detail=(t "nodeDriver.amazonec2.access.detail")
    expandAll=expandAll
    expand=(action expandFn)
    expandOnInit=true
  }}
    {{#unless hideRegionSelection}}
      <div class="row">
        <div class="col span-4">
          <label class="acc-label" for="amazonec2-region-select">
            {{t "nodeDriver.amazonec2.region.label"}}
          </label>
          {{#if (eq step 1)}}
            <select
              id="amazonec2-region-select"
              class="form-control"
              onchange={{action (mut config.region) value="target.value"}}
            >
              {{#each regionChoices as |choice|}}
                <option value={{choice}} selected={{eq config.region choice}}>
                  {{choice}}
                </option>
              {{/each}}
            </select>
          {{else}}
            <div>
              {{config.region}}
            </div>
          {{/if}}
        </div>
      </div>
    {{/unless}}
    {{#if (eq step 1)}}
      {{form-auth-cloud-credential
        cancel=(action "cancel")
        cloudCredentials=cloudCredentials
        createLabel="nodeDriver.amazonec2.access.next"
        driverName=driverName
        parseAndCollectErrors=(action "errorHandler")
        finishAndSelectCloudCredential=(action "finishAndSelectCloudCredential")
        primaryResource=primaryResource
        progressStep=(action "awsLogin")
        region=config.region
        showAddCloudCredential=hideRegionSelection
      }}
      {{top-errors errors=errors}}
    {{else}}
      <div class="row">
        <div class="col span-4">
          <label class="acc-label">
            {{t "nodeDriver.amazonec2.accessKey.label"}}
          </label>
          <div>
            {{config.accessKey}}
          </div>
        </div>
        <div class="col span-4">
          <label class="acc-label">
            {{t "nodeDriver.amazonec2.secretKey.label"}}
          </label>
          <div class="text-muted text-italic">
            {{t "nodeDriver.amazonec2.secretKey.provided"}}
          </div>
        </div>
      </div>
      <div class="row">
        <div class="span-8 offset-4">
          <p class="text-info text-small m-0">
            {{t "nodeDriver.amazonec2.access.help"}}
          </p>
        </div>
      </div>
    {{/if}}
  {{/accordion-list-item}}
  <div class="{{unless (gte step 2) "hide"}}">
    {{#accordion-list-item
      title=(t "nodeDriver.amazonec2.zone.title")
      detail=(t "nodeDriver.amazonec2.zone.detail")
      expandAll=expandAll
      expand=(action expandFn)
      expandOnInit=true
    }}
      {{#if (eq step 2)}}
        <div class="row">
          <label class="acc-label" for="amazonec2-availabilityZone">
            {{t "nodeDriver.amazonec2.availabilityZone"}}
          </label>
          <select
            class="form-control"
            id="amazonec2-availabilityZone"
            onchange={{action (mut selectedZone) value="target.value"}}
          >
            {{#each zoneChoices as |choice|}}
              <option value={{choice}} selected={{eq selectedZone choice}}>
                {{choice}}
              </option>
            {{/each}}
          </select>
        </div>
        <div class="row">
          <label class="acc-label pt-20">
            {{t "nodeDriver.amazonec2.subnet"}}
          </label>
          {{#if subnetChoices.length}}
            {{#each subnetChoices as |choice|}}
              {{#if choice.isVpc}}
                <hr class="mt-20 mb-20" />
                <div class="radio">
                  <label class="acc-label pb-0">
                    {{radio-button selection=selectedSubnet value=choice.value}}
                    {{choice.label}}
                    {{#each choice.tags as |tag|}}
                      <span class="tag-xs bg-info mr-5">
                        <i class="icon icon-tag"></i>
                        {{tag}}
                      </span>
                    {{/each}}
                  </label>
                </div>
              {{else}}
                <div class="radio">
                  <label class="ml-20">
                    {{radio-button selection=selectedSubnet value=choice.value}}
                    <i
                      class="icon icon-level-down text-muted"
                      style="transform: scaleX(-1) rotate(90deg);"
                    ></i>
                    {{choice.label}}
                    {{#each choice.tags as |tag|}}
                      <span class="tag-xs bg-info mr-5">
                        <i class="icon icon-tag"></i>
                        {{tag}}
                      </span>
                    {{/each}}
                  </label>
                </div>
              {{/if}}
            {{/each}}
          {{else}}
            {{t "nodeDriver.amazonec2.noSubnet"}}
          {{/if}}
        </div>
      {{else}}
        <div class="row">
          <div class="span-6">
            <label class="acc-label">
              {{t "nodeDriver.amazonec2.availabilityZone"}}
            </label>
            {{config.region}}
            {{config.zone}}
          </div>
          <div class="span-6">
            <label class="acc-label pt-20">
              {{t "nodeDriver.amazonec2.subnet"}}
            </label>
            {{#if config.subnetId}}
              {{config.subnetId}}
            {{else}}
              {{config.vpcId}}
            {{/if}}
          </div>
        </div>
      {{/if}}
    {{/accordion-list-item}}
    {{#if (eq step 2)}}
      {{top-errors errors=errors}}
      {{save-cancel
        save=(action "selectSubnet")
        cancel=(action "cancel")
        createLabel="nodeDriver.amazonec2.zone.next"
        savingLabel="nodeDriver.amazonec2.zone.loading"
      }}
    {{/if}}
  </div>
  <div class="{{unless (gte step 3) "hide"}}">
    {{#accordion-list-item
      title=(t "nodeDriver.amazonec2.securityGroup.title")
      detail=(t "nodeDriver.amazonec2.securityGroup.detail")
      expandAll=expandAll
      expand=(action expandFn)
      expandOnInit=true
    }}
      <div class="row">
        {{#if (eq step 3)}}
          <div class="radio pt-10">
            <label>
              {{radio-button selection=whichSecurityGroup value="default"}}
              {{t
                "nodeDriver.amazonec2.securityGroup.defaultCreate"
                groupName=defaultSecurityGroupName
                htmlSafe=true
              }}
            </label>
          </div>
          {{#if (and settings.isRancher (not isCustomSecurityGroup))}}
            <p class="text-info ml-20">
              <a
                href="{{settings.docsBase}}/installation/references/"
                target="_blank"
              >
                {{t "nodeDriver.amazonec2.portHelp.link"}}
              </a>
              {{t "nodeDriver.amazonec2.portHelp.text"}}
            </p>
          {{/if}}
          <div class="radio pt-10">
            <label>
              {{radio-button selection=whichSecurityGroup value="custom"}}
              {{t "nodeDriver.amazonec2.securityGroup.choose"}}
            </label>
          </div>
          {{#if isCustomSecurityGroup}}
            <select
              class="form-control existing-security-groups"
              multiple="true"
              onchange={{action "multiSecurityGroupSelect" ""}}
            >
              {{#each allSecurityGroups as |choice|}}
                <option
                  value={{choice.name}}
                  selected={{array-includes selectedSecurityGroup choice.name}}
                >
                  {{choice.name}}
                  (
                  {{choice.id}}
                  )
                </option>
              {{/each}}
            </select>
          {{/if}}
        {{else}}
          <div>
            {{#if (is-array config.securityGroup)}}
              <div class="comma-seperated-list">
                {{#each config.securityGroup as |group|}}
                  <span>
                    {{group}}
                  </span>
                {{/each}}
              </div>
            {{else}}
              {{defaultSecurityGroupName}}
            {{/if}}
          </div>
        {{/if}}
      </div>
    {{/accordion-list-item}}
    {{#if (eq step 3)}}
      {{top-errors errors=errors}}
      {{save-cancel
        save=(action "selectSecurityGroup")
        cancel=(action "cancel")
        createLabel="nodeDriver.amazonec2.securityGroup.next"
        savingLabel="nodeDriver.amazonec2.securityGroup.loading"
      }}
    {{/if}}
  </div>
  <div class="{{unless (gte step 4) "hide"}}">
    {{#accordion-list-item
      title=(t "nodeDriver.amazonec2.instance.title")
      detail=(t "nodeDriver.amazonec2.instance.detail")
      expandAll=expandAll
      expand=(action expandFn)
      expandOnInit=true
    }}
      <div class="row">
        <div class="col span-6">
          <label class="acc-label" for="amazonec2-instancetype">
            {{t "nodeDriver.amazonec2.instanceType.label"}}
          </label>
          {{new-select
            classNames="form-control"
            id="amazonec2-instancetype"
            value=config.instanceType
            content=instanceTypes
            optionValuePath="name"
            optionLabelPath="name"
            optionGroupPath="group"
          }}
        </div>
        <div class="col span-6">
          <label class="acc-label">
            {{t "nodeDriver.amazonec2.requestSpotInstance.label"}}
          </label>
          <div class="checkbox">
            <label class="acc-label" for="amazonec2-requestspotinstance">
              {{input
                id="amazonec2-requestspotinstance"
                type="checkbox"
                checked=config.requestSpotInstance
              }}
              {{t "nodeDriver.amazonec2.requestSpotInstance.enable"}}
            </label>
          </div>
        </div>
      </div>
      {{#if config.requestSpotInstance}}
        <div class="row">
          <div class="col span-6">
            <label class="acc-label" for="amazonec2-spotprice">
              {{t "nodeDriver.amazonec2.spotPrice.label"}}
            </label>
            <div class="input-group">
              {{input
                id="amazonec2-spotprice"
                type="text"
                classNames="form-control"
                placeholder=""
                value=config.spotPrice
              }}
              <span class="input-group-addon bg-default">
                {{t "nodeDriver.amazonec2.spotPrice.unit"}}
              </span>
            </div>
          </div>
        </div>
      {{/if}}
      <div class="row">
        <div class="col span-6">
          <label class="acc-label" for="amazonec2-rootsize">
            {{t "nodeDriver.amazonec2.rootSize.label"}}
          </label>
          <div class="input-group">
            {{input
              id="amazonec2-rootsize"
              type="text"
              classNames="form-control"
              placeholder=""
              value=config.rootSize
            }}
            <span class="input-group-addon bg-default">
              {{t "nodeDriver.amazonec2.rootSize.unit"}}
            </span>
          </div>
        </div>
        <div class="col span-6">
          <div class="checkbox">
            <label class="acc-label">
              {{t "nodeDriver.amazonec2.encryptEbsVolume.label"}}
            </label>
            <div class="checkbox">
              <label class="acc-label" for="amazonec2-encrypt-ebs-vol">
                {{input
                  id="amazonec2-encrypt-ebs-vol"
                  type="checkbox"
                  checked=config.encryptEbsVolume
                }}
                {{t "nodeDriver.amazonec2.encryptEbsVolume.radioLabel"}}
              </label>
            </div>
          </div>
        </div>
      </div>
      {{#if config.encryptEbsVolume}}
        <div class="row">
          <div class="col span-6 offset-6">
            <label class="acc-label">
              {{t "clusterNew.amazoneks.secretsEncryption.kmsHelpLabel"}}
            </label>
            {{searchable-select
              classNames="form-control"
              optionValuePath="KeyArn"
              optionLabelPath="KeyArn"
              content=allKmsKeys
              value=(mut config.kmsKey)
              allowCustom=true
            }}
            {{#if loadFailedKmsKeys}}
              <p class="help-block text-warning">
                {{t "clusterNew.amazoneks.secretsEncryption.failure"}}
              </p>
            {{/if}}
          </div>
        </div>
      {{/if}}
      <div class="row">
        <div class="col span-6">
          <div>
            <label class="acc-label">
              {{t "nodeDriver.amazonec2.metadata.httpEndpoint.label"}}
            </label>
          </div>
          <div class="radio mb-0">
            <label class="mr-5">
              {{radio-button
                selection=config.httpEndpoint
                value="enabled"
                name="http-endpoint"
              }}
              {{t "nodeDriver.amazonec2.metadata.httpEndpoint.enabled"}}
            </label>
            <label>
              {{radio-button
                selection=config.httpEndpoint
                value="disabled"
                name="http-endpoint"
              }}
              {{t "nodeDriver.amazonec2.metadata.httpEndpoint.disabled"}}
            </label>
            <div class="protip mt-5">
              {{t "nodeDriver.amazonec2.metadata.httpEndpoint.protip"}}
            </div>
          </div>
        </div>
        <div class="col span-6">
          <div>
            <label class="acc-label">
              {{t "nodeDriver.amazonec2.metadata.httpTokens.label"}}
            </label>
          </div>
          <div class="radio mb-0">
            <label class="mr-5">
              {{radio-button
                selection=config.httpTokens
                value="required"
                name="http-tokens"
              }}
              {{t "nodeDriver.amazonec2.metadata.httpTokens.required"}}
            </label>
            <label>
              {{radio-button
                selection=config.httpTokens
                value="optional"
                name="http-tokens"
              }}
              {{t "nodeDriver.amazonec2.metadata.httpTokens.optional"}}
            </label>
            <div class="protip mt-5">
              {{t "nodeDriver.amazonec2.metadata.httpTokens.protip"}}
            </div>
          </div>
        </div>
      </div>
      <!-- not sure if we are going to show these yet but we can -->
      {{#unless true}}
        <div class="row">
          <div class="col span-6">
            <label class="acc-label" for="amazonec2-volumeType">
              {{t "nodeDriver.amazonec2.volumeType.label"}}
            </label>
            {{input
              id="amazonec2-volumeType"
              type="text"
              classNames="form-control"
              placeholder=""
              value=config.volumeType
            }}
          </div>
          <div class="col span-6">
            <div class="checkbox">
              <label class="acc-label">
                {{t "nodeDriver.amazonec2.useEbsOptimizedInstance.label"}}
              </label>
              <div class="checkbox">
                <label class="acc-label" for="amazonec2-use-opt-instance">
                  {{input
                    id="amazonec2-use-opt-instance"
                    type="checkbox"
                    checked=config.useEbsOptimizedInstance
                  }}
                  {{t "nodeDriver.amazonec2.useEbsOptimizedInstance.radioLabel"
                  }}
                </label>
              </div>
            </div>
          </div>
        </div>
      {{/unless}}
      <div class="row">
        <div class="col span-6">
          <label class="acc-label" for="amazonec2-ami">
            {{t "nodeDriver.amazonec2.ami.label"}}
          </label>
          {{input
            id="amazonec2-ami"
            type="text"
            classNames="form-control"
            placeholder=(t "nodeDriver.amazonec2.ami.placeholder")
            value=config.ami
          }}
          {{#if settings.isRancher}}
            <p class="help-block">
              <a
                href="https://github.com/rancher/os/blob/master/README.md/#user-content-amazon"
                target="_blank"
                rel="noreferrer nofollow"
              >
                {{t "nodeDriver.amazonec2.ami.rancherList"}}
              </a>
            </p>
          {{/if}}
        </div>
        <div class="col span-6">
          <label class="acc-label" for="amazonec2-iam">
            {{t "nodeDriver.amazonec2.iam.label"}}
          </label>
          {{input
            id="amazonec2-iam"
            type="text"
            classNames="form-control"
            value=config.iamInstanceProfile
            placeholder=(t "nodeDriver.amazonec2.iam.placeholder")
          }}
        </div>
      </div>
      <div class="row">
        <div class="col span-6">
          <label class="acc-label" for="amazonec2-sshUser">
            {{t "nodeDriver.amazonec2.sshUser.label"}}
          </label>
          {{input
            id="amazonec2-sshUser"
            type="text"
            classNames="form-control"
            placeholder=(t "nodeDriver.amazonec2.sshUser.placeholder")
            value=config.sshUser
          }}
        </div>
        <div class="col span-6">
          <label class="acc-label">
            {{t "nodeDriver.amazonec2.privateIp.label"}}
          </label>
          <div class="checkbox">
            <label class="acc-label" for="amazonec2-privateip">
              {{input
                id="amazonec2-privateip"
                type="checkbox"
                checked=config.privateAddressOnly
              }}
              {{t "nodeDriver.amazonec2.onlyPrivate.label"}}
            </label>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col span-12">
          {{form-key-value
            addActionLabel="nodeDriver.amazonec2.tags.addActionLabel"
            initialMap=tags
            changed=(action (mut tags))
          }}
        </div>
      </div>
    {{/accordion-list-item}}
    <div class="over-hr">
      <span>
        {{templateOptionsTitle}}
      </span>
    </div>
    {{form-name-description model=model nameRequired=true rowClass="row mb-10"}}
    {{form-user-labels
      initialLabels=labelResource.labels
      setLabels=(action "setLabels")
      expand=(action expandFn)
    }}
    {{form-node-taints model=model expand=(action expandFn)}}
    {{form-engine-opts machine=model showEngineUrl=showEngineUrl}}
    {{top-errors errors=errors}}
    {{save-cancel save=(action "save") cancel=(action "cancel") editing=editing
    }}
  </div>
{{/accordion-list}}